<template>
  <m-page>
    <!-- 自动还款主页 -->
    <m-header title="自动还款设置选择"></m-header>
    <!-- 融易通卡列表 -->
    <!-- 当存在多张融易通卡时 显示列表 -->
    <div class="card_list" v-if="cardData.length > 1">
      <div class="card_list_item" v-for="item in cardData" :key="item.id">
        <ynet-cell-item
          @click="gotoSetting(item.id)"
          :title="item.name+' (尾号'+item.lastnumber+') '"
          :addon="item.isSet?'已设置':'未设置'"
          arrow
        >
          <span class="holder" slot="left"></span>
        </ynet-cell-item>
      </div>
    </div>

    <!-- 当只有一张融易通卡时  显示具体信息 -->
    <div class="card_list" v-if="cardData.length <= 1">
      <div class="card_list_item" v-for="item in cardData" :key="item.id">
        <ynet-cell-item :title="item.name+' (尾号'+item.lastnumber+') '">
          <span class="holder" slot="left"></span>
          <span class="item_right" slot="right">
            <ynet-switch v-model="item.isSet"></ynet-switch>
          </span>
        </ynet-cell-item>
        <!-- 融易通卡自动还款设置信息 -->
        <div class="card_autopayinfo" v-if="item.isSet">
          <ynet-cell-item title="还款币种" addon="人民币" no-border></ynet-cell-item>
          <ynet-cell-item title="付款账户" addon="长沙银行储蓄卡（尾号8888）" no-border></ynet-cell-item>
          <ynet-cell-item title="还款金额设置" addon="按账单扣款（全额还款）" no-border></ynet-cell-item>

          <ynet-button type="warning" @click="gotoSetting(item.id)">修改还款设置</ynet-button>
        </div>
      </div>
    </div>
  </m-page>
</template>

<script>
import { CellItem, Switch ,Button} from "ynet-mobile";
export default {
  components: {
    [CellItem.name]: CellItem,
    [Switch.name]: Switch,
    [Button.name]:Button
  },
  data() {
    return {
      cardData: [
        {
          id: 1,
          name: "融易通信用卡",
          lastnumber: "1234",
          isSet: false
        },
        {
          id:2,
          name: "融易通信用卡",
          lastnumber: "4567",
          isSet: true
        }
      ]
    };
  },
  created() {},
  mounted() {},
  methods: {
    //页面跳转
    goto(item, params) {
      let url = `http://172.16.1.239:8080/rong_yi_tong_card/${item}`;
      window.location.href = url;
      // app.api.pushWindow( url ,params )
    },
    // 点击进入自动还款设置页面
    gotoSetting(id) {
      let params = {};
      for (let i = 0; i < this.cardData.length; i++) {
        if (id == this.cardData[i].id) {
          params = this.cardData[i];
        }
      }
      console.log(params)
      this.goto("auto_payment/autopay_page.html", params);
    }
  },
  watch: {},
  computed: {}
};
</script>

<style lang="scss" scoped>
@import "./index.scss";
</style>

